import React, { useEffect, useState } from 'react'
import { useSelector,useDispatch } from 'react-redux'
import { getBanner } from '../store/models/goods'
// import {getBannersApi} from '../store/pubApi'

const Child2 = () => {
    const dispatch = useDispatch()
    const banners = useSelector(state => state.goods.banners)
    const loading = useSelector(state => state.goods.loading)
    // 调用异步getBanner
    useEffect(() => {
        dispatch(getBanner())
    },[])


  return (

    <div>
        {loading && <div style={{fontSize:40,color:'red'}}>加载中...</div>}
        <h1>Child2</h1>
        {/* <p>年龄:{age}</p>
        <p>性别:{sex}</p>
        <button onClick={() => {
            dispatch({
                type:'Type_age'
            })
        }}>age+</button> */}

        <ul>
            {banners.map(item => {
                return <li key={item.imageUrl}>
                    <img src={item.imageUrl} width={200} alt="" />
                </li>
            })}
        </ul>
    </div>
  )
}

export default Child2